/*
 * 工具条生成工具
 * version : "1.0",
 * auther : "陈 庭",
 *
 * Date: 2010-11-24
 *
 */
(function($) {
	$.yxToolbar = {
		initCss : function(options){
			/*默认显示配置及用户当前配置*/
			var defaults = {

			}
			var config = $.extend(defaults,options);
			
			// 动态加入皮肤样式(CSS)
			$("script").each(function () { 
				if(this.src.toString().match(/jquery\.yxToolbar.*?js$/)) { 
					// 创建样式表
					$("head").append("<link rel=\"stylesheet\" type=\"text/css\" href=\"" + this.src.toString().replace(/jquery\.yxToolbar.*?js$/, "") + "Toolbar.css" + "\" id=\"yxToolbarCss\" />");
					return false; 
				}
			});
		}
	}
	
	// 插件功能代码
    $.fn.yxToolbar = function(options) {
        var opts = $.extend({}, $.fn.yxToolbar.defaults, options);
		
		// 容器DIV的HTML
		var barDivHtml = '<div class="toolbar" style="border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: rgb(141, 178, 227); "></div>';
		
		// 文字按钮的容器HTML
		var elementTableHtml = '<table class="elementTable"><tbody><tr class="elementTr"><td style="width: 2px; "></td></tr></tbody></table>';
		// 图片按钮的容器HTML
		var filterTableTableHtml = '<table cellpadding="0" cellspacing="0" id="filterTable" class="filterTable"><tbody><tr class="over"><td class="b_left"></td><td class="b_right"></td></tr></tbody></table>';

		// 添加文字按钮函数
		var addElement = function(elementOptions, obj){
			var eOpts = $.extend({}, $.fn.yxToolbar.elementDefaults, elementOptions);
			
			// 取得容器
			var containerTr = $(obj).find('.toolbar .elementTable .elementTr').eq(0);
			
			// 添加间隔线
			if($(containerTr).children('td').length > 1){
				$(containerTr).append('<td><span class="spacer"></span></td>');
			}
			
			// 判断类型 （现在只能是button类型）
			var eTypeClass = 'button_table';
			if(eOpts.type == 'textfield'){
				eTypeClass = 'textfield_table';
			}
			
			// 添加结点
			var eNode = $('<td><table class="' + eTypeClass + '" cellpadding="0" cellspacing="0"><tbody><tr><td class="b_left"></td><td class="b_center"><a class="' + eOpts.css + '">' + eOpts.name + '</a></td><td class="b_right"></td></tr></tbody></table></td>');
			$(containerTr).append(eNode);
			
			// 取得结点
			var containerTd = $(containerTr).children("td:last").eq(0);
			// 是否有自定义图标
			if(eOpts.img != ''){
				$(containerTd).find('a').css('background-image', 'url(' + eOpts.img + ')');
			}
			
			// 是否可以启用
			if(!eOpts.userAble){
				$(containerTd).find('table').addClass('toolbar_disabled');
				$(containerTd).find('a').attr('disabled', true);
			}else{
				// 添加事件
			  $(containerTd).find('tr').eq(0).bind('mouseover', function () {
				var b = $(this);
				b.addClass('over');
				b.bind('mouseout', function () {
				  b.removeClass('over');
				  b.removeClass('down');
				});
			  });
			  $(containerTd).find('tr').eq(0).bind('mousedown', function () {
				var b = $(this);
				b.addClass('down');
				b.bind('mouseup', function () {
				  b.removeClass('down');
				  b.unbind('mouseup');
				});
			  });
			  $(containerTd).find('tr').eq(0).click(function(){
				  try{
					  eOpts.clickEvent(containerTd);
				  }catch(e){}
			  });
			}
		};
		
		// 添加图片按钮函数
		var addFilter = function(filterOptions, i, obj){
			
			var fOpts = $.extend({}, $.fn.yxToolbar.filterDefaults, filterOptions);
			
			var rightTd = $(obj).find('.toolbar .filterTable .b_right').eq(0);

			if($(rightTd).prevUntil('.b_left').length > 0){
				$(rightTd).before('<td><span class="filter-spacer"></span></td>');
			}
			
			var fNode = $('<td id="' + fOpts.id + '" class="b_center"><a title="' + fOpts.title + '" class="' + fOpts.css + '"></a></td>');
			
			$(rightTd).before(fNode);
			
			var containerTd = $(obj).find('.toolbar .filterTable .b_center:last');
			// 是否有自定义图标
			if(fOpts.img != ''){
				$(containerTd).find('a').css('background-image', 'url(' + fOpts.img + ')');
			}
			
			if(!fOpts.userAble){
				$(containerTd).addClass('toolbar_disabled');
				$(containerTd).find('a').attr('disabled', true);
			}else{
			  $(containerTd).click(function(){
				  var containerTr = $('.toolbar .filterTable .over');
				  var oldIndex = $(containerTr).attr("currentIndex");
				  // 去掉旧按钮样式
				  if(typeof(oldIndex) != 'undefined'){
				  	$(containerTr).children("td").eq(oldIndex).removeClass('border-center-active');
					if(oldIndex == 1){
						$(containerTr).children("td:first").removeClass('border-left-active');
					}else if(oldIndex == $(containerTr).children("td").length - 1){
						$(containerTr).children("td:last").removeClass('border-left-active');
					}
				  }
				  // 添加新按钮样式
				  $(this).addClass('border-center-active');
				  $(containerTr).attr("currentIndex", $(this).index());
				  if($(this).index() == 1){
					  $(containerTr).children("td:first").addClass('border-left-active');
				  }else if($(this).index() == $(containerTr).children("td").length - 1){
					  $(containerTr).children("td:last").addClass('border-left-active');
				  }
				  try{
					  eOpts.clickEvent(containerTd);
				  }catch(e){}
			  });
			}
		};
		
		// 程序正式执行地方
        return this.each(function() {
			$(this).html(barDivHtml);
			// 开始添加文字按钮
			if(opts.element != null){
				$(this).find('.toolbar:first').append(elementTableHtml);
				if($.isArray(opts.element)){
					for(var i in opts.element){
						addElement(opts.element[i], this);
					}
				}else{
					addElement(opts.element);
				}
			}
			// 开始添加图片按钮
			if(opts.filter != null){
				$(this).find('.toolbar:first').append(filterTableTableHtml);
				if($.isArray(opts.filter)){
					for(var i in opts.filter){
						addFilter(opts.filter[i], i, this);
					}
				}else{
					addFilter(opts.filter);
				}
			}
        });
		
		
    };

	// 默认配置参数
    $.fn.yxToolbar.defaults = {
		element: null,    // 元素数据，具体请参考下面的参数
		filter:null      //
    };
	
	// 默认元素配置参数
    $.fn.yxToolbar.elementDefaults = {
		type: 'button',    // 元素类型
		name: '默认按钮',   // 元素名称
		css: 'new',        // 元素样式
		img: '',           // 元素图标
		userAble: true,    // 是否启用元素
		clickEvent: function(containerTd){}  // 元素点击事件
	};
	
	// 默认图片按钮配置参数
    $.fn.yxToolbar.filterDefaults = {
		id: 'filter',        // 元素TD的ID
		title: '默认按钮',   // 元素名称
		css: 'btn-all',        // 元素样式
		img: '',           // 元素图标
		userAble: true,    // 是否启用元素
		clickEvent: function(containerTd){}  // 元素点击事件
	};

})(jQuery);